import React from 'react';
import {inject, observer} from 'mobx-react';
import {Button, Modal, Col, Spin, Tooltip} from 'antd';
import {WeaPopoverHrm, WeaSelect, WeaRightMenu, WeaTab, WeaTop, WeaLocaleProvider} from 'ecCom';
import {WeaTableNew} from "comsMobx";
import {toJS} from 'mobx';
import {getSearchs, setWindowKeys} from "../../util/Util";

const getLabel = WeaLocaleProvider.getLabel;
const WeaTable = WeaTableNew.WeaTable;

/**
 * 绩效-待审核方案
 */
@inject("programAuditListStore")
@observer
export default class ProgramAuditList extends React.Component {

    constructor(props) {
        super(props);
        //tab操作后更新列表数据
        window.RefreshProgramAuditList = () => {
            this.props.programAuditListStore.tableStore.reloadCurrent();
            this.props.updateNum();
        }
        this.state = {
            //选中行
            selectedRowKeys: [],
            collectParams: {
                favname: getLabel(506164, "待审核方案"),
                favouritetype: "5",
                link: '/spa/workrelate/static/index.html#/main/workrelate/performance/performanceIndex?menutype=4',
                importantlevel: 1,
            }
        };
        this.rowSelection = {selectedRowKeys: this.state.selectedRowKeys,
            onChange: this.onSelectChange};
        this.store = this.props.programAuditListStore;
    }

    componentWillMount() {
        setWindowKeys(4, getLabel(506164, "待审核方案"));
        this.store.doInit();
    }

    componentWillUnmount() {
        window.RefreshProgramAuditList = null
    }

    render() {
        const {programtype, loading, form, condition, onProgramtypeChange, tableStore, showSearchAd, getTableDatas, advanceSearch, setShowSearchAd} = this.store;
        let {selectedRowKeys, collectParams} = this.state

        const adBtn = [ // 高级搜索内部按钮
            <Button ecId={`${this && this.props && this.props.ecId || ''}_Button@tp6jwu@search`} type="primary" onClick={advanceSearch}>{getLabel('388113', '搜索')}</Button>,
            <Button ecId={`${this && this.props && this.props.ecId || ''}_Button@ddsqw4@reset`} type="ghost" onClick={() => form.resetForm()}>{getLabel('2022', '重置')}</Button>,
            <Button ecId={`${this && this.props && this.props.ecId || ''}_Button@kxzuj5@cancel`} type="ghost" onClick={() => setShowSearchAd(false)}>{getLabel('31129', '取消')}</Button>,
        ];

        return (
            <Spin ecId={`${this && this.props && this.props.ecId || ''}_Spin@xpdhgz`} spinning={loading}>
                <div style={{height: "100vh"}}>
                    <WeaRightMenu ecId={`${this && this.props && this.props.ecId || ''}_WeaRightMenu@xs7kvl`} datas={this.getMenus()} collectParams={collectParams} showUrlItem={false}>
                        <WeaPopoverHrm ecId={`${this && this.props && this.props.ecId || ''}_WeaPopoverHrm@vmrz5s`}/>
                        <WeaTop ecId={`${this && this.props && this.props.ecId || ''}_WeaTop@2nyj70`}
                            title={getLabel('506164', '待审核方案')}
                            icon={<i className='icon-coms-implement'/>}
                            iconBgcolor='rgb(150, 53, 138)'
                            buttons={this.getButton(this.props.ecId || '')}
                            showDropIcon={true}
                            dropMenuDatas={this.getMenus()}
                        >
                        </WeaTop>
                        <WeaTab ecId={`${this && this.props && this.props.ecId || ''}_WeaTab@ejdj2c`}
                            searchType={["advanced", "base"]}
                            showSearchAd={showSearchAd}
                            setShowSearchAd={bool => setShowSearchAd(bool)}
                            searchsAd={getSearchs(form, condition, 2, false, advanceSearch,this.props.ecId|| '',"programaudit")}
                            hideSearchAd={() => setShowSearchAd(false)}
                            buttonsAd={adBtn}
                            onSearch={getTableDatas}
                            onSearchChange={v => form.updateFields({programname: v})}
                            searchsBaseValue={form.getFormParams().programname}
                            replaceLeft={(
                                <Col ecId={`${this && this.props && this.props.ecId || ''}_Col@tv3klr`} span={12} style={{'line-height': '46px', 'margin-left': '24px'}}>
                                    {getLabel('500401', '类型')}：
                                    <WeaSelect ecId={`${this && this.props && this.props.ecId || ''}_WeaSelect@iew5fj`}
                                        style={{width: '180px'}}
                                        value={form.getFormParams().programtype}
                                        options={programtype}
                                        onChange={(val) => onProgramtypeChange(val)}
                                    />
                                </Col>
                            )}
                        />
                        <WeaTable ecId={`${this && this.props && this.props.ecId || ''}_WeaTable@7crewj`}
                            comsWeaTableStore={tableStore}
                            hasOrder
                            needScroll
                            rowSelection={this.rowSelection}
                            onOperatesClick={this.onOperatesClick}
                        />
                    </WeaRightMenu>
                </div>
            </Spin>
        )
    }

    //获取菜单项
    getMenus = () => {
        const {getTableDatas} = this.store;
        let {selectedRowKeys} = this.state
        return [{
            key: '0',
            icon: <i className='icon-coms-search'/>,
            content: getLabel('388113', '搜索'),
            onClick: getTableDatas,
        }, {
            key: '1',
            icon: <i className="icon-coms-Approval"/>,
            content: getLabel('142', '批准'),
            onClick: this.approveBatch,
            disabled: selectedRowKeys.length == 0
        }, {
            key: '2',
            icon: <i className="icon-coms-go-back" />,
            content: getLabel('236', '退回'),
            onClick: this.returnBatch,
            disabled: selectedRowKeys.length == 0
        }, {
            key: '10',
            icon: <i className="icon-coms-Custom"/>,
            content: getLabel('32535', '显示列定制'),
            onClick: this.showColumn,
        }]
    }

    //显示列定制
    showColumn = () => {
        const {tableStore} = this.store;
        tableStore.setColSetVisible(true);
        tableStore.tableColSet(true);
    };

    //获取操作按钮
    getButton = (ecId) => {
        let {selectedRowKeys} = this.state
        return [
            <Tooltip ecId={`${ecId}_Tooltip@o59ar3@approve`} title={getLabel('508656', '批准已选')}><Button ecId={`${ecId}_Button@admk4j@approve`} type='primary' disabled={selectedRowKeys.length == 0}
                                                                onClick={this.approveBatch}>{getLabel('142', '批准')}</Button></Tooltip>,
            <Tooltip ecId={`${ecId}_Tooltip@8z2vby@return`} title={getLabel('508657', '退回已选')}><Button ecId={`${ecId}_Button@9rm2eg@return`} type='primary' disabled={selectedRowKeys.length == 0}
                                                                onClick={this.returnBatch}>{getLabel('236', '退回')}</Button></Tooltip>,
        ];
    }

    onSelectChange = (selectedRowKeys) => {
        this.setState({selectedRowKeys})
    };

    //批准已选
    approveBatch = () => {
        let {selectedRowKeys} = this.state
        if (selectedRowKeys.length > 0) {
            Modal.confirm({
                title: getLabel('386786', '信息确认'),
                content: getLabel('508729', '确定批准已选考核方案') + '?',
                onOk: () => {
                    let params = {
                        programids: selectedRowKeys,
                        operation: 'quick_approve',
                    };
                    this.store.programAuditOperation(params, this.props.updateNum);
                    this.setState({
                        selectedRowKeys: []
                    })
                },
            });
        } else {
            Modal.warning({
                title: getLabel('15804', '系统信息'),
                content: getLabel('501159', '请选择要操作的数据')
            });
        }
    }

    //退回已选
    returnBatch = () => {
        let {selectedRowKeys} = this.state
        if (selectedRowKeys.length > 0) {
            Modal.confirm({
                title: getLabel('386786', '信息确认'),
                content: getLabel('508730', '确定退回已选考核方案') + '?',
                onOk: () => {
                    let params = {
                        programids: selectedRowKeys,
                        operation: 'quick_return',
                    };
                    this.store.programAuditOperation(params, this.props.updateNum);
                    this.setState({
                        selectedRowKeys: []
                    })
                },
            });
        } else {
            Modal.warning({
                title: getLabel('15804', '系统信息'),
                content: getLabel('501159', '请选择要操作的数据')
            });
        }
    };

    //批准全部
    doApproveAll = () => {
        Modal.confirm({
            title: getLabel('386786', '信息确认'),
            content: getLabel('508731', '确定批准全部考核方案') + '?',
            onOk: () => {
                let params = {
                    operation: 'all_approve',
                };
                this.store.programAuditOperation(params, this.props.updateNum);
                this.setState({
                    selectedRowKeys: []
                })
            },
        });
    };

    //退回全部
    doReturnAll = () => {
        Modal.confirm({
            title: getLabel('386786', '信息确认'),
            content: getLabel('508732', '确定退回全部考核方案') + '?',
            onOk: () => {
                let params = {
                    operation: 'all_return',
                };
                this.store.programAuditOperation(params, this.props.updateNum);
                this.setState({
                    selectedRowKeys: []
                })
            },
        });
    };

    //表格每行右侧菜单操作
    onOperatesClick = (record, index, operate, flag)=> {
        let message, operation;
        if (operate.index === '0') {
            //批准
            message = getLabel('508727', '确定批准此考核方案');
            operation = 'approve'
        } else if (operate.index === '1') {
            //退回
            message = getLabel('508728', '确定退回此考核方案');
            operation = 'return'
        }
        let params = {
            programid: record.id,
            operation: operation,
        };
        Modal.confirm({
            title: getLabel('386786', '信息确认'),
            content: message + '?',
            onOk: () => {
                this.store.programAuditOperation(params, this.props.updateNum);
            },
        });
    }

};